<!-- <script> 
import { ref } from 'vue';
export default {
  // 1.选项式
  // data(){
  //   return {
  //     count:100
  //   }
  // },
  // methods: {
  //   add() {
  //     this.count++
  //   },
  //   cut(){
  //     this.count--
  //   }
  // }
  // 2.组合式
  setup() {
    const add = () => count.value++
    const cut = () => count.value--
    const count = ref(200)
    return { cut, add, count }
  }
}
</script> -->

<script setup>
// setup语法糖
// 没有setup的时候按照vue2的写法编写
import { ref } from 'vue'
// 计算器功能
const count = ref(99)
const add = () => count.value++
const cut = () => count.value--
// console.log(this) // undefined
</script>

<template>
  <div>
    <button @click="cut">-</button>
  <span> {{ count }} </span>
  <button @click="add">+</button>
  </div>
</template>

<style scoped>

</style>
